<template>
    <div class="height-100 flex flex-direction-column font-size-30">
        <zt-card>
            <div class="flex">
                <div class="flex-1">
                    <zt-number-scroll-bg :numm="numberData" :isComma="true" />
                </div>
                <div class="flex-1">
                    <zt-number-scroll :numm="numberData" :isComma="true" />
                </div>
            </div>
            <div class="flex margin-t-20">
                <div class="flex-1">
                    <zt-number-scroll-bg :numm="numberData" />
                </div>
                <div class="flex-1">
                    <zt-number-scroll :numm="numberData" />
                </div>
            </div>
            <div class="flex margin-t-20">
                <div class="flex-1">
                    <zt-number-scroll-bg :numm="numberData1" :isComma="true" />
                </div>
                <div class="flex-1">
                    <zt-number-scroll :numm="numberData1" :isComma="true" />
                </div>
            </div>

            <div class="flex margin-t-20">
                <div class="flex-1">
                    <zt-number-scroll-bg :numm="numberData1" />
                </div>
                <div class="flex-1">
                    <zt-number-scroll :numm="numberData1" />
                </div>
            </div>

        </zt-card>
    </div>
</template>

<script setup>

const numberData = ref(2584)
const numberData1 = ref(2584)

setInterval(() => {
    random(100, 1000)
    random2(100, 1000)
    random3(100,1000)
}, 2000)

// 取随机数
async function random(min, max) {
    let num = Math.floor(Math.random() * (max - min)) + min
    numberData1.value += num
}
// 取随机数保留两位小数
function random2(min, max) {
    let num = Math.floor(Math.random() * (max - min)) + min
    // numberData.value += num.toFixed(2)
}
// 生成随机小数 保留两位小数 不要是整数
function random3(min, max) {
    let num = Math.random() * (max - min) + min
    numberData.value += num.toFixed(2)*1
}


const searchFormData = [
    {
        type: "Input", // 输入框类型
        label: "会员名称", //中文名称
        prop: "realname", //字段名称
        span: 4, // 总共24等份   占此等份的多少  列如 12等份 占1/2  等份数
        labelWidth: 70, //搜索文字提示的宽度   默认值 80  需要的自行调整
        clearable: true, // 是否显示清除按钮 默认为true
    },

    {
        type: "Select", //下拉框类型
        label: "设备类型",
        prop: "deviceTyep1",
        span: 4,
        options: [
            { label: "塔式起重机", value: 0 },
            { label: "施工升降机", value: 1 },
        ], //下拉框选项  为select 时必传 否则没有值
        clearable: true, // 是否显示清除按钮 默认为true
    },

    {
        type: "Daterange", // 开始跟结束日期时间段选择 类型
        label: "验收日期",
        prop: "date2",
        span: 6,
        valueFormat: "YYYY-MM-DD", //日期格式  返回出来的数据格式  默认值 YYYY-MM-DD
        format: "YYYY/MM/DD", //界面选择之后显示的日期格式   默认值 YYYY-MM-DD
        startPlaceholder: "请选择开始日期", //开始时间提示语
        endPlaceholder: "请选择结束日期", //结束时间提示语
    },
    {
        type: "Select", //下拉框类型
        label: "是否开启",
        prop: "deviceTyep1",
        span: 4,
        options: [
            { label: "开启", value: 0 },
            { label: "关闭", value: 1 },
        ], //下拉框选项  为select 时必传 否则没有值
        clearable: true, // 是否显示清除按钮 默认为true
    },
    {
        type: "Datetimerange", // 开始跟结束日期时间段选择 类型
        label: "安装日期",
        prop: "date24",
        span: 7,
        valueFormat: "YYYY-MM-DD HH:mm:ss", //日期格式  返回出来的数据格式  默认值 YYYY-MM-DD
        format: "YYYY/MM/DD HH:mm:ss", //界面选择之后显示的日期格式   默认值 YYYY-MM-DD
        startPlaceholder: "请选择开始日期时间", //开始时间提示语
        endPlaceholder: "请选择结束日期时间", //结束时间提示语
    },


    {
        type: "DatePicker", // 日期选择器 类型
        label: "检测日期",
        prop: "date1",
        valueFormat: "YYYY-MM-DD", //日期格式  返回出来的数据格式   默认值 YYYY-MM-DD
        format: "YYYY/MM/DD", //界面选择之后显示的日期格式   默认值 YYYY-MM-DD
        span: 4,
    },
]

</script>

<style lang='scss' scoped></style>